<template>
    <div style="width: 1200px;margin: 0 auto;">
        <div class="searchForm">
            <div>
                入库截止日期： 
        		<el-date-picker
        		      size="small"
        		      v-model="search_form.buyer_date"
        			  value-format="yyyy-MM-dd"
        		      type="date"
        		      placeholder="选择日期时间">
        		    </el-date-picker>
            </div>
            <div>
                商品名称： 
        		<el-input size="small" v-model="search_form.goods_name" 
        		placeholder="请输入商品名称"  
        		style="width:200px;"></el-input>
            </div>
           <!-- <div >
        		<div style="display: flex;">
        			<div>
        				供应商：
        			</div>
        			<div>
        				<selectCustomer :supp="search_form.supplier" 
						@getCustomerName="getCustomerName" />
        			</div>
        		</div>
            </div> -->
			<div>
			    <el-button type="primary" size="mini" @click="search">检索</el-button>
			    <el-button size="mini" @click="clearSearch">重置/检索</el-button>
			</div>
			<div style="margin-top: 2px;margin-left: 10px;">
				<el-checkbox v-model="is_jc" border size="mini">寄存商品</el-checkbox>
			</div>
        </div>
		<br>
        <el-table  :data="list"  
			 border 
			 stripe
			>
			</el-table-column>
			<el-table-column  align="center" width="80"
				label="序号">
				<template slot-scope="scope">
				   <div >
					   {{scope.$index+1}}
				   </div>
				  
				</template>
			</el-table-column>
			<el-table-column  width="350"
				label="商品名称">
				<template slot-scope="scope">
				   <div  style="cursor: pointer;">
					  {{scope.row.goods_name}}
				   </div>
				   
				</template>
			</el-table-column>
			
			<el-table-column  align="center"   prop="brand" label="商品品牌" />
			<el-table-column  align="center"   prop="cate" label="商品系列" />
		    <el-table-column  align="center"   prop="add_time" label="添加时间" />
			<el-table-column  align="center"   prop="update_time" label="修改时间" />
		    <el-table-column  label="操作"   align="center">
				<template slot-scope="scope">
					<div class="button_text" @click="del(scope.row.id)">
					  删除
				  </div>
				</template>
			</el-table-column>
		
        </el-table>
		<div class="page">
		    <el-pagination
		            background
		            @size-change="pageChange"
		            @current-change="handleCurrentChange"
		            :current-page="page"
		            :page-size="pageSize"
		            layout="total, sizes, prev, pager, next, jumper"
		            :total="page_totle">
		    </el-pagination>
		</div>
		<el-dialog
		  :title="goods_name"
		  :close-on-click-modal="false"
		  :visible.sync="isShow"
		  width="1331px">
		  <showGoodsInfo @onSuccess="onSuccess" 
			:is_jc="is_jc"
		  :goods_name="goods_name" v-if="isShow" />
		</el-dialog>
		<el-dialog
		  :title="title"
		  :close-on-click-modal="false"
		  :visible.sync="isShowAdd"
		  width="600px">
		  <addTag  v-if="isShowAdd" :tagId="tagId" 
			:tag_name="tag_name"
			:title="title" @close="closetag" />
		</el-dialog>
    </div>
</template>
<script>
	import selectCustomer from '@/components/selectCustomer.vue'
	import showGoodsInfo from './components/showGoodsInfo.vue'
    import addTag from './components/addTag.vue'
	export default {
        components:{
			selectCustomer,showGoodsInfo,addTag
        },

        data(){
            return {
				list:[],
                rowData:{},
				isShow:false,
				pageSize:20,
				page:1,
				page_totle:0,
				search_form:{
					supplier:'',
					buyer_date:"",
					goods_name:"",
					logistics_number:""
				},
				goods_name:'',
				is_jc:false,
				isShowAdd:false,
				tagData:[],
				tagId:0,
				title:'添加标签',
				tag_name:''
            }
        },
		watch:{
			is_jc:{
				handler(){
					this.search()
				}
			}
		},
        mounted(){
            document.title = '库存商品'
			this.search_form.buyer_date = this.$utils.formatNowDate(2)
			this.lodeList()
			this.lodetag()
        },
        methods:{
			del(id){
				if(confirm('确定删除')){
					console.log(12)
					this.$post('/goods/delOverData',{id,is_jc:this.is_jc},res=>{
						this.lodeList()
					})
				}
				
			},
			addTagBtn(){
				this.isShowAdd=true
				this.title = '添加标签'
			},
			closetag(){
				this.isShowAdd = false
				this.lodetag()
			},
			lodetag(){
				this.$post('/goods/getTagData',{},res=>{
					this.tagData = res.data.data
				})
			},
			selectTag(el){
				if(this.tagId == el.id){
					this.isShowAdd = true
					this.tag_name = el.tag_name
					this.title = '查看标签'
				}else{
					this.tagId = el.id
					this.lodeList()
				}
			},
			handleClose(el){
				this.$post('/goods/delTagData',{id:el.id},res=>{
					this.lodetag()
				})
			},
			onSuccess(){
				this.isShow = false
				this.lodeList()
			},
			showInfo(goods_name){
				this.isShow = true
				this.goods_name = goods_name
			},
			returnCodeLength(strArr){
				if(strArr){
					return JSON.parse(strArr).length
				}
			},
			getCustomerName(val){
				this.search_form.supplier = val
			},
			clearSearch(){
				this.search_form  = {
				        supplier:'',
				        buyer_date:"",
				        goods_name:"",
				        logistics_number:""
				}
				this.tagId = 0
				this.page=1
				this.lodeList()
			},
			toInfo(row){
				this.$router.push({
					path:"/buyerSys/buyerInfo",
					query:{
						order_number:row.order_number					}
				})
			},
			compare1(obj1,obj2){
				    var val1 = obj1.brand;
				    var val2 = obj2.brand;
					if(val1 == val2){
						val1 = obj1.cate;
						val2 = obj2.cate
					}
				    if (val1 < val2) {
				        return -1;
				    } else if (val1 > val2) {
				        return 1;
				    } else {
				        return 0;
				    }    
			},
            lodeList(){
				let params = {
					search_form:this.search_form,
					page:this.page,
					pageSize:this.pageSize,
					is_jc:this.is_jc,
					tagId:this.tagId
				}
				
				this.$post('/buyerSys/getInventoryList1',params,res=>{
					let data = res.data.data
					this.page_totle = data.count
					this.list = data.result
					
				})
			},            
        }
    }
</script>
